html, body {
height: 98%;
font-family: tahoma;
font-size: 13px;
}

#container {
	text-align:center;
}

#left {
	float:left; 
	position:relative; 
	width:20%;
	height:100%;
}

#topleft{
	height:50%;
	border:5px solid green;
	border-radius:25px;
	background-color: #C9E4C9;
	margin: 5px;
}

#botleft{
	height:50%;
	border:5px solid green;
	border-radius:25px;
	background-color: #C9E4C9;
	margin: 5px;
}

#right {
	float:left; 
	position:relative; 
	width:75%;
	height:100%;
}

#topright{
	height: 39%;
	border:5px solid green;
	border-radius:25px;
	background-color: #C9E4C9;
	margin: 5px;
}

#topright #siteList {
	width: 90%;
	margin: auto;
}

.tabcheck {
float: left;
padding: 2px 5px;
}

#botright{
    padding-top: 10px;
	height: 100%;
	border:5px solid green;
	border-radius:25px;
	background-color: #C9E4C9;
	margin: 5px;
}

#center{
	border:5px solid green;
	border-radius:25px;
	height: 60%;
	background-color: #C9E4C9;
	margin-top: 5px;
}

.tabcontainer{
	margin:10px 0;
}

.tabcontainer .tab_nav{
	list-style:none;
	display:block;
	overflow:hidden;
	margin:0;
	margin-left:10px;
	padding:0px;
	position:relative;
	top:1px;
}

.tabcontainer .tab_nav ul {
    list-style-type:none;
    margin: 0;
    padding: 0;
}

.tabcontainer .tab_nav li{
	float:left;
	background-color:green;
	border:1px solid #e1e1e1;
	padding:5px!important;
	cursor:pointer;
	border-bottom:none;
	margin-right:10px;
	font-family:verdana;
	font-weight:bold;
	color:#fff;
}

.tabcontainer .tab_nav ul li a {
    display: block;
    margin: 2px;
    padding: 2px 5px;
    text-decoration: none;
	padding-right: 100px;
	float: left;
}

.tabcontainer .tab_nav ul li.active{
	background-color:#fff;
	color:#000;
}
	
.tabcontainer .tab{
    height: 90%;
	padding:10px;
	background-color:#fff;
	overflow:hidden;
	float:left;
	margin-bottom:10px;
	margin-left:10px;
	border:1px solid #e1e1e1;
	width:93%;
}




/****** Tab 1**********/



#tab_tab1 svg path {

stroke: green;
stroke-width: 3;
fill: none;
}

#tab_tab1 svg text {
fill: black;
opacity: 0;
}

#tab_tab1 svg text.gridtext {
fill: black;
opacity: 1;
}

#tab_tab1 svg .name {
opacity: 0;
}

#tab_tab1 svg circle {
opacity: 0;
}

#tab_tab1 svg line.grids {
stroke-dasharray: 5, 4, 7, 5;
stroke: black; 
stroke-width: 2;
stroke-opacity: 0.3;
}

#tab_tab1 svg line.baseline {
stroke: black; 
stroke-width: 2;
stroke-opacity: 0.3;
}

#tab_tab1 svg .gridcontrol {
fill: black;
}

#tab_tab1 svg .unfocused path {
stroke: #DBDBDB;
opacity: 0;
}

#tab_tab1 svg .hover circle, #tab_tab1 svg .hover text {
opacity: 1;
}

#tab_tab1 svg .hover text.name {
opacity: 0;
}

#tab_tab1 svg .hover path {
stroke: green;
opacity: 1;
}

#tab_tab1 svg .compath path {
stroke: blue;
opacity: 1;
}

#tab_tab1 svg .userph, #tab_tab1 svg .userwater, #tab_tab1 svg .usersun {
fill: orange;
opacity: 1;
}

#tab_tab1 svg .compath .name {
fill: blue;
opacity: 0;
}

#tab_tab1 svg .antpath path {
stroke: red;
opacity: 1;
}

#tab_tab1 svg .antpath .name {
fill: red;
opacity: 0;
}

#tab_tab1 svg #nametext {
opacity: 1;
}

#tab_tab1 svg #comtext {
opacity: 1;
fill: blue;
}

#tab_tab1 svg #anttext {
opacity: 1;
fill: red;
}